{% extends "based/based.html" %}
{% block title %}{{_("主题代码编辑")}}-{% endblock %}
{% block content %}
<data id="filename" content="{{data.filename}}" hidden></data>
<data id="path" content="{{data.path}}" hidden></data>
<div id="app" >
    <div class="row">
        <div class="col-md-12">
            <ul class="breadcrumb">
                <li><a href="/osr-admin/theme-setting/file?type={{data.from_type}}&page={{data.from_page}}">
                    <i class="fa fa-html5"></i> {{_("页面")}}</a>
                </li>
                <li class="active">{{_("页面编辑")}}</li>
            </ul>
        </div>
    </div>
    <div class="row osr-adm-edit-page">
         <div class="col-md-12 osr-col-xs-12">
           <section class="panel">
              <header class="panel-heading">
                <span><i class="fa fa-shield"></i> {{_("权限修改")}}</span>
              </header>
              <div class="panel-body">
                  <div class="alert alert-info osr-alert osr-alert-warning">
                     <button data-dismiss="alert" class="close close-sm" type="button">
                         <i class="fa fa-times"></i>
                     </button>
                       <div class="osr-remind-alert">
                        <i class="fa fa-bell-o osr-color-warning" >{{_("提示")}}:</i>
                        <i class="osr-color-danger fa fa-exclamation-circle"></i>{{_('此页面功能只是提供给"单点部署"站点的快捷修改. 如果你是集群部署,请勿使用此功能')}}
                        </div>
                  </div>

                 <div class="form-group ">
                      <label>{{_("当前编辑")}}: {[file_relative_path]}/{[filename]}</label>
                      <textarea  style="height:500px" class="form-control"  v-model="content" v-bind="content"></textarea>
                  </div>

                <div class="form-group-sm">
                  <button onclick="save()" class="btn osr-btn btn-info" >
                      {{_("保存修改")}}
                  </button>
                 </div>
              </div>
           </section>

         </div>
    </div>
</div>

<script>

    var vue = new Vue({
      el: '#app',
      delimiters:['{[', ']}'],
      data:{
            content:"",
            file_relative_path:"",
            file_path:"",
            filename:"",

            }
    })

    // 加载完页面执行
    $(document).ready(function(){

        vue.filename = $("#filename").attr("content");
        vue.file_path = $("#path").attr("content");
        get_content();

    })
    function get_content(){
        d = {
            file_path:vue.file_path,
            filename:vue.filename
        }

        var result = osrHttp("GET","/api/admin/static/file",d, args={not_prompt:true});
       result.then(function (r) {
            vue.content = r.data.content;
            vue.file_relative_path = r.data.file_relative_path;

       });

    }

    //当点击提交按钮,提交用于填入的数据到api
    function save(){
        d = {
            file_path:vue.file_path,
            filename:vue.filename,
            content:vue.content
        }
        osrHttp("PUT","/api/admin/static/file",d);

    }
</script>
{% endblock %}